<!--   @author  Created By  YS  on 2023/10/22 -->
<!--   @describe 我是-->

<!--   @author  Created By  YS  on 2023/10/22 -->
<!--   @describe -->

<template>
  <div class="flex-column">
<!--    <image :src="src" class="head-img" @click="upload"></image>-->
    <u-upload
        :fileList="fileList"
        @afterRead="afterRead"
        name="1"
        multiple
        :maxCount="1"
    >

    </u-upload>
    <div>
      <u-cell-group :border="false">
        <u-cell :border="false" title="昵称" :isLink="true" value="请选择" ></u-cell>
        <u-cell  :border="false" title="签名" :isLink="true" value="请选择"></u-cell>
        <u-cell  :border="false" title="生日" :isLink="true" value="请选择"></u-cell>
        <u-cell  :border="false" title="身高" :isLink="true" value="请选择"></u-cell>
        <u-cell  :border="false" title="体重" :isLink="true" value="请选择"></u-cell>
        <u-cell  @click="openPick('gender')" :border="false" title="性取向" :isLink="true" :value="form.gender"></u-cell>
        <u-cell  :border="false" title="角色" :isLink="true" value="请选择"></u-cell>
        <u-cell  :border="false" title="体型" :isLink="true" value="请选择"></u-cell>
        <u-cell  :border="false" title="工作所在地" :isLink="true" value="请选择"></u-cell>
        <u-cell  :border="false" title="故乡" :isLink="true" value="请选择"></u-cell>
      </u-cell-group>
      <div class="change-gap">经济情况</div>
      <u-cell-group :border="false">
        <u-cell :border="false" title="收入" :isLink="true" value="请选择" ></u-cell>
        <u-cell  :border="false" title="购房情况" :isLink="true" value="请选择"></u-cell>
        <u-cell  :border="false" title="购车情况" :isLink="true" value="请选择"></u-cell>
      </u-cell-group >
      <div class="change-gap">教育背景</div>
      <u-cell-group :border="false">
        <u-cell :border="false" title="学历" :isLink="true" value="请选择" ></u-cell>
        <u-cell  :border="false" title="毕业院校" :isLink="true" value="请选择"></u-cell>
      </u-cell-group >
      <div class="change-gap">婚姻情况</div>
      <u-cell-group :border="false">
        <u-cell :border="false" title="婚况" :isLink="true" value="请选择" ></u-cell>
        <u-cell  :border="false" title="是否有小孩" :isLink="true" value="请选择"></u-cell>
      </u-cell-group>
    </div>
    <u-button  text="保存" @click="submit" :customStyle="customSty"></u-button>


    <u-popup :show="show" @close="close" :round="10" @open="open" :customStyle="popupStyle">
      <textarea name="" id="" cols="30" rows="10" placeholder="请输入修改名称" @input="change"></textarea>
      <view><text>还可输入10个字</text>      </view>
    </u-popup>
    <u-picker :show="showPick" :columns="columns" @confirm="confirm"></u-picker>
  </div>
</template>

<script>
import Enum from "@/utils/enums";
import url from "@/utils/url"
import ajax from "@/utils/ajax";
export default {
  name: 'iAm',
  data() {
    return {
      form:Enum.formData,
      src:require('../../../assets/img/logo.png'),
      customStyles: {
        marginTop:'30rpx',
        marginBottom:'150rpx'
      },
      show:false,
      popupStyle:{
        height:'1000px'
      },
      fileList:[],
      showPick:false,
      columns:[]
    }
  },
  computed: {
    customSty(){
      return Object.assign({},  Enum.customStyles,this.customStyles)
    }
  },
  methods: {
    open() {
      // console.log('open');
    },
    close() {
      this.show = false
      // console.log('close');
    },
    change() {

    },
    upload(){

    },
    async afterRead(event){
      console.log(event);
      const result = await this.uploadFilePromise(event.file[0].url)
      // let lists = [].concat(event.file)
      // let fileListLen = this[`fileList${event.name}`].length
      // // lists.map((item) => {
      // //   this[`fileList${event.name}`].push({
      // //     ...item,
      // //     status: 'uploading',
      // //     message: '上传中'
      // //   })
      // // })
      // for (let i = 0; i < lists.length; i++) {
      //   const result = await this.uploadFilePromise(lists[i].url)
      //   let item = this[`fileList${event.name}`][fileListLen]
      //   this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
      //     status: 'success',
      //     message: '',
      //     url: result
      //   }))
      //   fileListLen++
      // }

    },
    uploadFilePromise(url) {
      console.log(url);
      return new Promise((resolve, reject) => {
        let a = uni.uploadFile({
          url: 'https://api.test.wangxiaobao.com/face-detect/back/customer/attachment', // 仅为示例，非真实的接口地址
          filePath: url,
          // files:
          name: 'file',
          formData:{
            projectId:'123',
            id:'123'
          },
          success: (res) => {
            setTimeout(() => {
              resolve(res.data.data)
            }, 1000)
          }
        });
      })
    },
    openPick(type){
      console.log(Enum.formDataList[type]);
      this.showPick = true;
      this.columns = [Enum.formDataList[type]]
    },
    confirm(val){
      console.log(val);
      this.form.gender = val.value[0]
      this.showPick = false;
    },
    submit(val){
      ajax.submitPerson(this.form)
      let data = Object.assign({},this.form);
      // uni.request({
      //   url: url.login.login, //仅为示例，并非真实接口地址。
      //   data,
      //   method:'POST',
      //   header: {
      //     'content-type': 'application/json' // 默认值
      //   },
      //   success: (res) => {
      //     console.log(res.data);
      //     if(res.data.code === 200){
      //       uni.showToast({
      //         title: '保存成功',
      //         icon: 'success',
      //         duration: 2000
      //       })
      //     }
      //   }
      // })
    }
  },

}
</script>

<style lang='scss' scoped>
@import "../../../assets/css/base.scss";
.change-gap{
  width: 750rpx;
  height: 88rpx;
  opacity: 1;
  background: #eaeaea;
  color: #333333;
  text-align: left;
  font-size: 28rpx;
  line-height: 100rpx;
  padding-left: 30rpx;
}


.head-img {
  width: 92rpx;
  height: 92rpx;
  margin-top: 30rpx;
  margin-bottom: 30rpx;
}

</style>
